<template>
  <div class="workTicketChange flowCloumn h100">
    <div class="h100">
      <list-table-new v-bind="tableSetting" ref="klTable"></list-table-new>
      <div class="annotations list-table-main">
        注：
        <span class="circle normal-bg"></span>
        按期的工单
        <span class="circle remind-bg"></span>
        即将到期的工单
        <span class="circle warning-bg"></span>
        已超期的工单
      </div>
    </div>
  </div>
</template>
<script>
import {
  issuePlanList,
  issuePlan,
} from "@/api/productionPlan/overhaulPlanPackage.js";
export default {
  data() {
    return {
      tableSetting: {
        radioShow: false,
        pageConfig: {
          pageCode: "experimentPlan",
          userId: this.$store.getters.userInfo.namePy,
        },
        searchObj: {
          searchMethod: (params, sortStr) => {
            this.getTableData(params, sortStr);
          },
          queryData: {
            page: 1,
            pageSize: 15,
            jobType: "experiment",
          },
          searchArr: [
            {
              type: "text",
              label: "工作内容",
              model: "content",
            },
            {
              type: "organization",
              label: "设备管理单位",
              model: "deptManageName",
              idsStr: "deptManage",
            },
            {
              type: "select",
              label: "状态",
              model: "status",
              placeholder: "请输入",
              option: this.$store.getters.dirtData("package_issue_status"),
            },
            {
              type: "datetimerange",
              label: "计划时间",
              model: "planStartTime",
            },
            {
              type: "text",
              label: "计划编号",
              model: "code",
            },
            {
              type: "device",
              label: "设备名称",
              model: "equipmemtName",
              idsStr:"equipmemtId"
            },
            {
              type: "text",
              label: "工单编号",
              model: "issueCode",
            },
            {
              type: "text",
              label: "计划包编号",
              model: "packageCode",
            },
            {
              type: "daterange",
              label: "提醒时间",
              model: "remindTime",
            },
          ],
        },
        //过滤器的值
        filterFormData: {},
        //过滤器的默认值
        defaultFilterData: {},
        userCustomData: [],
        actionList: [
          {
            name: "新建",
            icon: "el-icon-plus",
            disabled: !this.$store.getters.isBtnAuth("add"), //控制按钮的禁用
            content: "未授权功能", //禁用提示内容
            method: (row) => {
              this.goDetailPage(
                null,
                "experimentPlanDetail",
                "add",
                "experiment"
              );
            },
          },
          // {
          //   name: "下发",
          //   icon: "el-icon-s-promotion",
          //   disabled: !this.$store.getters.isBtnAuth("issue"), //控制按钮的禁用
          //   content: "未授权功能", //禁用提示内容
          //   method: (row) => {
          //     this.getSelectData();
          //   },
          // },
        ],
        column: [
          {
            label: "状态",
            prop: "status",
            scopeType: "formate",
            sortable: "custom",
            method: (row) => {
              let str = this.$store.getters.fineDirtDataName(
                "package_issue_status",
                row.status
              );
              if (row.color == "#95F204") {
                return `<span class="normal">${str}</span>`;
              } else if (row.color == "#FAA224") {
                return `<span class="remind">${str}</span>`;
              } else {
                return `<span class="warning">${str}</span>`;
              }
            },
          },
          {
            label: "编号",
            prop: "planCode",
            sortable: "custom",
          },
          {
            label: "设备管理单位",
            prop: "deptManageName",
            sortable: "custom",
          },
          {
            label: "设备名称",
            prop: "equipmentName",
            showTooltip: true,
            sortable: "custom",
            formatter: (row) => {
              return row.equipments
                .map((i) => {
                  return i.equipmentName;
                })
                .join(", ");
            },
          },
          {
            label: "工作内容",
            prop: "content",
            showTooltip: true,
            sortable: "custom",
          },
          {
            label: "计划起止时间",
            prop: "startTime",
            sortable: "custom",
            showTooltip: true,
            formatter: (row) => {
              return `${row.startTime}~${row.endTime}`;
            },
          },
          {
            label: "提醒时间",
            prop: "remindTime",
            sortable: "custom",
          },
          {
            width: 200,
            label: "工单编号",
            prop: "issueCode",
            type: "textButton",
            sortable: "custom",
            method: (row, index) => {
              this.goDetailPage(row, "experimentOrderDetails", "edit");
            },
          },
          {
            width: 200,
            label: "计划包编号",
            prop: "packageCode",
            type: "textButton",
            sortable: "custom",
            method: (row, index) => {
              this.goDetailPage(
                row.packageId,
                "overhaulPlanPackageDetail",
                "detail"
              );
            },
          },
        ],
        paginationObj: {
          pageSizes: [15, 30, 50, 100],
        },
        totalNumber: 0,
        //表格方法
        tableMethods: {
          //点击行的方法
          rowClick: (row) => {
            this.goDetailPage(row.id, "experimentPlanDetail", "edit");
          },
        },
        // isDisabled: (row) => {
        //   return row.status != 2 ? true : false;
        // },
      },
    };
  },
  created() {
    /* 添加监听事件 */
    window.addEventListener("storage", this.updateData);
  },
  beforeDestroy() {
    /* 删除监听事件 */
    window.removeEventListener("storage", this.updateData);
  },
  mounted() {
    this.$refs.klTable.getTableConfig();
    //this.updateData();
  },
  methods: {
    updateData() {
      this.$refs.klTable.searchData();
    },
    // 获取表格数据
    getTableData(params, sortStr) {
      let queryData = Object.assign({}, params);
      if (sortStr.length > 0) {
        queryData.orders = sortStr;
      }
      if (queryData.planStartTime && queryData.planStartTime != "") {
        queryData.startTime = queryData.planStartTime[0];
        queryData.endTime = queryData.planStartTime[1];
      }
      issuePlanList(queryData).then((res) => {
        this.$set(this.tableSetting, "tableData", res.data.list);
        this.$set(this.tableSetting, "totalNumber", res.data.total);
      });
    },
    //跳转到详情页
    goDetailPage(id, router, type, jobType) {
      const { href } = this.$router.resolve({
        name: router,
        query: {
          id: id ? id : "",
          pageType: type ? type : "",
          jobType: jobType ? jobType : "",
        },
      });
      window.open(href, "_blank");
    },
    getSelectData() {
      let data = this.$refs.klTable.getRadioData();
      if (data) {
        this.$confirm("确定要下发选中计划吗", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            issuePlan({ issueId: data.id }).then((res) => {
              if (res.code === 200) {
                this.$message.success(res.description);
                this.$refs.klTable.searchData();
              }
            });
          })
          .catch((e) => {});
      } else {
        this.$message.warning("请选择一条数据");
      }
    },
  },
};
</script>
<style lang="less" scoped>
.flowCloumn {
  display: flex;
  flex-flow: column nowrap;
}
</style>